<template>
    <div class="special" @click="toSpeacil(specialList.id,isz,specialList.article_type)">
      <div v-if="specialList.images.length>1">
         <div class="weui-cell ">
             <div class="weui-cell__bd title">
                  {{specialList.title}}  
             </div>
             <div class="weui-cell__ft" v-if="type!=2">
                  <report :info="specialList" type="1"  model="1"></report>
             </div>
         </div>
         <div class="imgs" v-if="specialList.images.length>0">
            <!-- <img :src="item"  v-for="(item,idx) in specialList.images" :key="idx" mode="aspectFill" v-if="idx<3"  lazy-load="true">  -->
            <imgLoad 
                defaultImage='/static/images/z.png'
                :originalImage='item' 
                 v-for="(item,idx) in specialList.images"
                 v-if="idx<3"
                 :key="idx"
                width="220rpx"
                height="160rpx"
            />   
         </div>
         <div class="weui-cell" v-if="isOperate">
             <div class="weui-cell__bd ">
                <operate :info="specialList" iszan="true" isshare="true" iscomt="true" :type="isz?'1':'2'" ></operate>
             </div>
             <div class="weui-cell__ft time" v-if="type!=2">
                 {{specialList.created_at}}
             </div>
         </div> 
      </div>
      <div v-else>
          <div class="weui-cell danImg">
              <div class="weui-cell__hd">
                  <div class="imgs" style="padding-left:0" v-if="specialList.images.length>0">
                     
                     <imgLoad 
                      defaultImage='/static/images/z.png'
                      :originalImage='item' 
                      v-for="(item,idx) in specialList.images"
                      :key="idx"
                      width="220rpx"
                      height="160rpx"
                  />     
                  </div> 
              </div>
              <div class="weui-cell__bd" >
                <div class="title">{{specialList.title}} </div>
              </div>
              <div v-if="type!=2">
                <report :info="specialList" type="1" model="1"></report>
              </div>
          </div>
          <div class="weui-cell" v-if="isOperate">
             <div class="weui-cell__bd ">
                <operate :info="specialList" iszan="true" isshare="true" iscomt="true" :type="isz?'1':'2'" ></operate>
             </div>
             <div class="weui-cell__ft time" v-if="type!=2">
                 {{specialList.created_at}}
             </div>
         </div> 
      </div>   
    </div>  
</template>
<script>
// type==1  专栏列表 资讯列表
// type==2  推荐模块下的 专栏 资讯列表
import report from "@/components/report";
import operate from "@/components/operate";
import imgLoad from "@/components/imgLoad";
export default {
  props: ["specialList","type","idx","isz","isOperate"],
  components: {
       imgLoad,
       report,
       operate
  },
  methods:{
    toSpeacil(id,isz,Type){
      // isz=1 专栏
      // isz=0 资讯
      let url="../speacilDetail/main?isz="+isz+"&id="+id+"&keType="+Type;
      mpvue.navigateTo({url})
    },
    like(e,item,idx){
        // let like=e.currentTarget.dataset.like;
        // console.log(a)
        // let liked=!a;
        // let idx=e.currentTarget.dataset.idx;
        this.$emit("click",{item,idx})
    },
    tocomment(){
        let url="../writeComment/main?type=1"
        mpvue.navigateTo({url})
    },
    toAnswer(){
        let url="../writeAnswer/main"
        mpvue.navigateTo({url})
    },
  },
};
</script>
<style >
.special .imgs .imgLoad{
   margin-right:7px;
}

</style>
<style lang="scss" scoped>
   .special {
      border-bottom:5px solid #F4F5F5;
      text-align:left;
      .title{
        line-height:1.5;
        font-size:14px;
        font-weight:bold;
        color:rgba(51,51,51,1);
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
      }
     .imgs{
       padding-left:15px;
       img{
         width:110px;
         height:80px;
         margin-right:7px;
       }
     }
     .danImg{
       -webkit-box-align:center;
       -webkit-align-items:flex-start;
       align-items:flex-start;
     }
     .time{
        color:rgba(102,102,102,1);
        line-height:18px;
        font-size:11px;
     }
    
   }
</style>
